<template>
  <drag-modal
    title="查看"
    :width="450"
    :visible="visible"
    :destroyOnClose="true"
    :maskClosable="false"
    @cancel="cancel"
  >
    <a-spin :spinning="loading">
      <a-form-model :model="form" ref="form" :label-col="{span: 5}" :wrapperCol="{span: 16, offset: 1}">
        <div class="fold">
          <a-form-model-item
            label="类型"
            prop="type"
          >
            <span>{{form.type | dictFilter(dict.type)}}</span>
          </a-form-model-item>
          <a-form-model-item
            v-if="form.type != 0"
            label="上级名称"
            prop="parentName"
          >
             <span>{{form.parentName}}</span>
          </a-form-model-item>
          <a-form-model-item
            label="名称"
            prop="name"
          >
            <span>{{form.name}}</span>
          </a-form-model-item>
          <a-form-model-item
            label="层级"
            prop="level"
          >
            <span>{{form.level}}</span>
          </a-form-model-item>
          <a-form-model-item
            label="层级序列"
            prop="levelSqe"
          >
            <span>{{form.levelSqe}}</span>
          </a-form-model-item>
        </div>
      </a-form-model>
    </a-spin>
    <template slot="footer">
      <a-button @click="cancel">关闭</a-button>
    </template>
  </drag-modal>
</template>

<script>
import {regionService} from '@/services'

export default {
  name: 'QueryModal',
  props: {
    visible: {
      type: Boolean,
      required: true
    }
  },
  data () {
    return {
      loading: false,
      form: {
        type: undefined,
        level: undefined,
        levelSqe: undefined,
        parentName: undefined,
        name: undefined
      },
      dict: {
        type: [],
      }
    }
  },
  filters: {
    dictFilter: (val, dictList) => {
      const dict = dictList.find(item => item.value == val)
      return dict ? dict.title : '未知'
    }
  },
  methods: {
    cancel() {
      this.$emit('cancel')
    },
    queryAction(val) {
      this.loading = true
      const params = {
        id: val
      }
      regionService.query(JSON.stringify(params)).then(res => {
        const result = res.data
        if (result.code === 200) {
          this.form = result.data
        }
      }).finally(this.loading = false)
    }
  },
  mounted() {
    this.getDict(JSON.stringify({code: 'SYS_REGION_TYPE'})).then(res => this.dict.type = res.data.data)
  }
}
</script>
